
import React from "react"
class App extends React.Component{
  constructor(props){
    super(props);
    // 1. 修正this 指向的第一种方式 在构造函数中通过 bind 改变 this 的指向
    // this.handleClick = this.handleClick.bind(this);
  }

  // 1. 定义一个类属性 msg
  msg="我是一个消息";
  // 2. 定义一个类函数 handleClick  
  // handleClick(){
  //   console.log(this);
  //   // TypeError: Cannot read property 'msg' of undefined
  //   console.log(this.msg);
  // }
  handleClick=()=>{
    console.log(this);
    // TypeError: Cannot read property 'msg' of undefined
    console.log(this.msg);
  }
  // 3. 定义一个render 函数
  render(){
    return <div>
      {/*4. 定义一个点击事件*/}
      {/*修正 this 指向第二中方式 定义的时候 通过 bind 绑定 this*/}
      {/* <button onClick={this.handleClick.bind(this)}>点击，获取类属性中的msg(bind this)</button> */}
      <button onClick={this.handleClick}>点击，获取类属性中的msg</button>
    </div>
  }
}
// 5 导出 App 组件
export default App;